<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>毕业设计管理系统</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />

    {% include 'public/script.html' %}

    {% include 'public/style.html' %}

    <style>
        .layui-form-item select[name^=type]{
            display:none!important;
        }
        img{
            width:100%;
            height:100%;
            object-fit:cover;
        }
        img{
            height:90%;
           /* width:100%;
            object-fit:cover;*/
        }
        .tpl-login-logo{
            height:160px!important;
            display:flex;
            justify-content:center
        }
        .am-form-group {
            margin-bottom: 2rem!important;
        }
        .theme-white .tpl-login-content{
             padding: 10px 40px 10px!important;
        }
        input,
        input::placeholder{
            font-size:18px!important;
            letter-spacing:1px;
        }
        input{
            padding:8px 10px!important;
        }
        .layui-btn{
            font-size：18px!important;
            letter-spacing:2px;
            height:45px!important;
        }
        body{
            background:url("/static/images/bg-login.png") no-repeat !important;
            background-size:cover !important;
        }
    </style>
</head>

<body data-type="login" class="theme-white">
    <div class="am-g tpl-g">

        <div class="tpl-login">
            <div class="tpl-login-content">
                <div class="tpl-login-logo">
                    <img src="/static/lib/admin-assets/img/logob.png" alt="">
                </div>
                <form  class="layui-form am-form tpl-form-line-form">
                    {%csrf_token%}
                    <div class="am-form-group">
                        <input type="text" class="tpl-form-input" id="username" name="username" required lay-verify="required"  autocomplete="new-password" placeholder="请输入帐号昵称" maxlength="20">
                    </div>
                    <div class="am-form-group">
                        <input type="password" class="tpl-form-input" id="password" name="password" required lay-verify="required" autocomplete="new-password" placeholder="请输入登录密码" maxlength="18">
                    </div>
                    <div class="am-form-group">
                        <input type="email" class="tpl-form-input" id="email" name="email" required lay-verify="required"  autocomplete="new-password" placeholder="请输入邮箱" maxlength="20">
                    </div>
                    <div class="am-form-group" style="margin-top:40px">
                        <button type="button"  lay-submit lay-filter="submit1" class="layui-btn am-btn am-btn-primary  am-btn-block tpl-btn-bg-color-success  tpl-login-btn">提交</button>
                    </div>
                    <div class="am-form-group" style="margin-top:40px">
                        <a href="{% url 'myhome_login' %}">已有帐号？快速登录</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script>
        layui.use(['layer', 'jquery', 'form'], function(){
          var form = layui.form;
          var $ = layui.jquery;

          //提交
          form.on('submit(submit1)', function(data){
            console.log(JSON.stringify(data.field));
            // 提交表单数据
            $.ajax({
                url:"{% url 'myhome_doRegister' %}",
                method:'post',
                data:data.field,
                success:function(res){
                    console.log("提交成功",res);
                    layer.msg(res.msg)
                    if(res.code == 200){
                       setTimeout(()=>{
                            window.location.href="/login"
                       },1500)
                    }
                }

            })
            return false;
          });
        });
    </script>

    <script src="/static/lib/admin-assets/js/amazeui.min.js"></script>
    <script src="/static/lib/admin-assets/js/app.js"></script>

</body>

</html>